<script setup lang="ts">
import { ref } from 'vue'
import { onShow } from '@dcloudio/uni-app'
import { getPlanDateList, getPlanInDay, checkCondition } from '@/services/doctorPlan'
import type { DoctorPlanInDay, PlanDateList } from '@/types/doctorPlan'
import dayjs from 'dayjs'

const query = defineProps<{
  deptSubId: string
  deptSubName: string
}>()

const deptSubId = ref<number>(0)
const selectedDate = ref(dayjs().format('YYYY-MM-DD'))
const showEmpty = ref(false)

const dateList = ref<PlanDateList[]>([])
//处理选择日期事件
const clickDataHandle = (date: string) => {
  selectedDate.value = date
  searchDeptSubDoctorPlanInDay()
}

const doctorList = ref<DoctorPlanInDay[]>([])
//处理点击挂号事件
const clickBtnHandle = (id: number) => {
  checkCondition({
    deptSubId: deptSubId.value,
    date: selectedDate.value,
  }).then((res) => {
    let result = res.result
    if (result == '已经达到当天挂号上限') {
      uni.showToast({
        icon: 'none',
        title: '每天只能挂号3次，您已达到当日上限',
      })
    } else if (result == '已经挂过该诊室的号') {
      uni.showToast({
        icon: 'none',
        title: '您已经挂过该诊室号了，不可重复挂号',
      })
    } else if (result == '不存在面部模型') {
      uni.showModal({
        title: '提示消息',
        content: '挂号需要人脸识别验证身份，你还没有录入面部信息，是否立即采集面部信息？',
        confirmText: '录入',
        success: function (resp) {
          if (resp.confirm) {
            //跳转到面部采集页面，录入面部信息
            uni.navigateTo({
              url: '/user/face_camera/face_camera?mode=create',
            })
          }
        },
      })
    } else if (result == '当日没有人脸验证记录') {
      uni.showModal({
        title: '提示消息',
        content: '每天第一次挂号之前，需要核验面部信息，以便确保是您本人挂号',
        confirmText: '验证',
        success: function (resp) {
          if (resp.confirm) {
            //跳转到面部采集页面，验证面部信息
            uni.navigateTo({
              url: '/user/face_camera/face_camera?mode=verificate',
            })
          }
        },
      })
    } else {
      //TODO 跳转到doctor_schedule页面
      uni.navigateTo({
        url: `/registration/doctor_schedule/doctor_schedule?deptSubId=${deptSubId.value}&doctorId=${id}&date=${selectedDate.value}`,
      })
    }
  })
}

//查询某个诊室7天出诊情况
const searchCanRegisterInDateRange = () => {
  getPlanDateList({
    deptSubId: deptSubId.value,
    startDate: dayjs().format('YYYY-MM-DD'),
    endDate: dayjs().add(6, 'day').format('YYYY-MM-DD'),
  }).then((res) => {
    let result = [...res.result]
    let array = ['日', '一', '二', '三', '四', '五', '六']
    for (let one of result) {
      //把星期几的阿拉伯数字转换成汉字数字
      let day = array[dayjs(one.date).day()]
      one.day = day
      one.dateOfMonth = dayjs(one.date).date()
    }
    dateList.value = result
  })
}

//查找某天科室医生出诊列表
const searchDeptSubDoctorPlanInDay = () => {
  const minioUrl = 'http://114.132.57.246:9000/hospital'
  getPlanInDay({
    deptSubId: deptSubId.value,
    date: selectedDate.value,
  }).then((res) => {
    let result = [...res.result]
    for (let one of result) {
      one.photo = `${minioUrl}${one.photo}`
    }
    doctorList.value = result
    if (result.length == 0) {
      showEmpty.value = true
    } else {
      showEmpty.value = false
    }
  })
}

onShow(async () => {
  deptSubId.value = parseInt(query.deptSubId)
  uni.setNavigationBarTitle({
    title: query.deptSubName,
  })
  Promise.all([searchCanRegisterInDateRange(), searchDeptSubDoctorPlanInDay()])
})
</script>

<template>
  <view>
    <view class="date-container">
      <view class="item" v-for="(one, index) in dateList" :key="index">
        <text class="day">{{ one.day }}</text>
        <view
          :class="one.date == selectedDate ? 'selector active' : 'selector'"
          @tap="clickDataHandle(one.date)"
        >
          <text class="date">{{ one.dateOfMonth }}</text>
          <text :class="one.status == '无号' ? 'status gray' : 'status'">{{ one.status }}</text>
        </view>
      </view>
    </view>
    <view class="doctor" v-for="one in doctorList" :key="one.id">
      <u-avatar :src="one.photo" size="45"></u-avatar>
      <view class="info">
        <view class="row">
          <text class="name">{{ one.name }}</text>
          <text class="job">（{{ one.job }}）</text>
          <button class="btn" @tap="clickBtnHandle(one.id)">挂号</button>
        </view>
        <view class="row">
          <text class="num">总量:{{ one.maximum }}</text>
          <text class="price">￥{{ one.price }}</text>
        </view>
        <view class="row">
          <text class="desc">{{ one.description }}</text>
        </view>
      </view>
    </view>
    <u-empty
      v-if="showEmpty"
      mode="list"
      text="无医生出诊记录"
      width="150"
      icon="http://cdn.uviewui.com/uview/empty/order.png"
    ></u-empty>
  </view>
</template>

<style lang="less">
@import url(dept_sub_plan.less);
</style>
